<template>
<div class="brand">
     <h4>周一周四新品首发</h4>
        <ul>
            <li v-for="item in newGoodsList" :key="item.id"  @click="gotoDetail(item)">
                <img :src="item.list_pic_url" alt="">
                <p class="box1">{{ item.name }}</p>
                <p class="price">{{ item.retail_price | formatMoney }}</p>
            </li>
        </ul>
</div>
</template>
<script>
export default {
name: '',
props:['newGoodsList'],
data() {
return {}
},
components: {
},
watch: {},
methods: {
     gotoDetail(item) {
      // console.log(item);
      this.$router.push({ path: "/productDetail", query: { id: item.id } });
    },
},

created() {},
};
</script>
<style scoped lang="less">
.brand ul{
 display: flex;
 flex-wrap: wrap;
 justify-content:space-between;
 
 li{
    width: 48%;
    position: relative;
    margin-bottom: 5px;
    
    img{
        width: 100%;
        display: block;
    }
    .box1{
        font-size: 16px;
        position: absolute;
        top: 165px;
        left: 25px;
        
    }
    .price{
        position: absolute;
        font-size: 15px;
        color: crimson;
        top: 197px; 
        left: 50px;
    }
 }

}
h4{
    display: block;
    height: 50px;
    text-align: center;
    line-height: 50px;
    margin-top: 10px;
}

</style>